<template>
  <div class="container">
    <headerNav></headerNav>
    <div class="mincard mindWidth">
      <span @click="$router.push('/')">首页</span>>
      <span>关于我们</span>
    </div>
    <div class="aboutUs">
      <div class="aboutUs_imgs">
        <img src="../../../static/image/aboutus/aboutus1.png" alt />
      </div>
      <div class="aboutUs_content">
        <h3>“查政策，太累/难了！”</h3>
        <p>比目镜团队，为了解决这个问题而萌生想法，并且从0到1诞生了比目镜平台。自2015年12月成立以来，我们一直努力打造一个基于政策数据资源整合的服务平台，结合自动化、智能化及大数据的技术创新应用，让企业、科创服务从业者、乃至广大老百姓都能轻松便捷地查询、及时接收他们所需要的政策及想了解的资讯，让国家政策红利得到更好的推广和落实。</p>
        <p>
          通过无数次的功能修改和产品迭代，我们已实现成立时的初衷。政策查询、政策订阅、政策解读、政策图谱
          功能已累计服务10w+用户，有效加速推动企业、科创服务及政策推广的发展进程。
        </p>
      </div>
      <div class="aboutUs_imgs" style="height: 500px">
        <img src="../../../static/image/aboutus/aboutus2.png" alt />
        <p @click="handleClick(0)">政策资讯介绍 >></p>
      </div>
      <div class="aboutUs_content">
        <h3>“科创数据，企业创新应用成绩单！”</h3>
        <p>企业科创数据，是企业创新应用及对政策项目响应情况的重要衡量指标，也是客观反应一个城市地区的企业创新能力及挖掘企业科创潜力的参考依据。</p>
        <p>挖掘科创数据的应用价值，作为比目镜团队的愿景一直没有动摇。我们致力于构建企业、园区、政府、企业服务商的互联生态链，整合数据服务资源，让政策红利可以精准、深入、有效地触达落地，实现多方共赢。</p>
      </div>
      <div class="aboutUs_imgs" style="height: 500px">
        <img src="../../../static/image/aboutus/aboutus3.png" alt />
        <p @click="handleClick(1)">科创数据介绍 >></p>
      </div>
      <div class="aboutUs_content">
        <h3>“为你的业务推广提供多一些方式”</h3>
        <p>酒香也怕巷子深！不管是个人、企业、服务商还是园区，都需要将自己的业务或产品传递给更多用户，创造收益。比目镜团队非常重视平台用户在推广方面的需求，并希望利用平台多年沉淀的资源和技术，为我们的用户提供更具实际价值的推广服务，让业务推广更简单、获客更精准。</p>
        <p>
          为此，我们不断尝试和打磨，根据不同用户的使用场景和需求，升级推出了
          微名片、严选服务商及智慧园区3.0
          功能服务，满足用户各种业务及产品的推广需求，为用户创造更多价值。
        </p>
      </div>
      <div class="aboutUs_imgs" style="height: 500px">
        <img src="../../../static/image/aboutus/aboutus4.png" alt />
        <p @click="handleClick(2)">推广服务介绍 >></p>
      </div>
      <div class="aboutUs_imgs" style="height: 600px">
        <img src="../../../static/image/aboutus/future.png" alt />
      </div>
    </div>
    <navigation></navigation>
    <footerNav></footerNav>
  </div>
</template>

<script>
export default {
  name: "aboutUs",
  data() {
    return {};
  },
  methods: {
    handleClick(val) {
      window.open("/introduce?type=" + val, "_blank");
    }
  }
};
</script>

<style lang="less" scoped>
.container {
  .mincard {
    span {
      font-size: 14px;
      cursor: pointer;
      margin: 0 10px;
    }
  }
}
.aboutUs_imgs {
  width: 100%;
  height: 600px;
  overflow: hidden;
  position: relative;
  img {
    width: 100%;
    min-width: 1920px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
  p {
    position: absolute;
    bottom: 30px;
    text-align: center;
    font-size: 20px;
    color: #fff;
    cursor: pointer;
    left: 50%;
    transform: translateX(-50%);
    display: inline-block;
    padding: 6px 10px;
  }
}
.aboutUs_content {
  width: 1200px;
  margin: 0 auto;
  margin-top: 150px;
  margin-bottom: 68px;
  h3 {
    font-size: 36px;
    margin-bottom: 40px;
  }
  p {
    color: rgba(142, 142, 142, 100);
    font-size: 18px;
    margin-bottom: 30px;
    line-height: 2;
  }
}
</style>
